<template>
  <div @click="onclick">
    <div>
      <img :src="index===itemindex?itemslist.icon_active:itemslist.icon" alt />
    </div>
    <div>
      <div :class="index===itemindex?'title_active':'title'">{{itemslist.title}}</div>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    item: {
      type: Object,
    },
    index: Number,
    itemindex: Number,
  },
  data() {
    return {
      itemslist: this.item,
    };
  },
  methods: {
    onclick() {
      this.$router.push(this.itemslist.path);
      this.$emit("tabbindex", this.index);
    },
  },
};
</script>

<style scoped>
.title {
  color: black;
}
.title_active {
  color: red;
}
</style>